<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>    
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>票品信息管理</title>
<%@include file="../../header.jsp" %>
<!-- my97datepicker -->
<script type="text/javascript" src="/My97DatePicker/WdatePicker.js"></script>

<!-- jquery fileupload -->
<script type="text/javascript" src="/js/vendor/jquery.ui.widget.js"></script>  
<script type="text/javascript" src="/js/jquery.iframe-transport.js"></script>  
<script type="text/javascript" src="/js/jquery.fileupload.js"></script>
<link rel="stylesheet" href="/css/jquery.fileupload.css">
<script type="text/javascript">
	$(function() {
		$("#adImgFile").fileupload({  
    	    url:"/common/upload.htm",//文件上传地址，当然也可以直接写在input的data-url属性内  
    	    formData:{type:"ticketAd"},//如果需要额外添加参数可以在这里添加  
    	    done:function(e,data){  
    	        //done方法就是上传完毕的回调函数，其他回调函数可以自行查看api  
    	        //注意result要和jquery的ajax的data参数区分，这个对象包含了整个请求信息  
    	        //返回的数据在result.result中，假设我们服务器返回了一个json对象  
    	        //console.log(JSON.stringify(result.result)); 
    	        var ret = eval("("+data.result+")");
    	        var url = ret.json.url;
    	        $("#adImg").attr("src", staticPath+url);
    	        $("#imgPath").val(url);
    	    }  
    	}) 
	})
	
	function selectScene() {
		var modal = $.bmodal({
			title:"选择景区",
			url:"/scene/dialog.htm",
			buttons:[{
				text:"保存",
				click:function() {
					var checkedScene = $("input[name='sceneId']:checked");
					var sceneId = checkedScene.val();
					var sceneName = checkedScene.parent().next().text();
					$("#ad-form").find("input[name='scenicId']").val(sceneId);
					$("#scene-name-display").val(sceneName);
					
					var sceneAddr = checkedScene.parent().next().next().next().text();
					$("#scene-div-name").text(sceneName);
					$("#scene-div-addr").text(sceneAddr);
					$("#scene-info-div").show();
					modal.modal("hide");
				}
			},{
				text:"关闭",
				click:function() {
					modal.modal("hide");
				}
			}]
		})
	}
	
	function saveAd() {
		$.ajax({
			url:"/ticket/ad/save.htm",
			type:"post",
			data:{
				scenicId:$("#scenicId").val(),
				fromTime:$("#openTime").val(),
				endTime:$("#closeTime").val(),
				picUrl:$("#imgPath").val(),
				listOrder:$("#listOrder").val(),
				dictionaryId:"${param.dictionaryId }"
			},
			dataType:"json"
		}).done(function(data){
			alert(data.msg);
			if(data.isSuccess)
				window.location = "/ticket/ad/index.htm?dictionaryId=${param.dictionaryId }&type=${param.type}";
		})
	}
</script>
</head>
<body>
<div class="ch-container">

<div class="row">
    <div class="box col-md-12">
        <div class="box-inner">
            <div class="box-content">
                <form class="form-inline" role="form" id="ad-form">
                    <div class="form-group col-md-4">
                        <label>选择景区：</label>
                        <input id="scene-name-display" type="text" readonly="readonly" class="form-control">
                        <input name="scenicId" type="hidden" id="scenicId">
                        <a href="javascript:;" class="btn btn-default" onclick="selectScene();">选择</a>
                    </div>
                    <div class="clearfix"></div><br>
                    <div id="scene-info-div" style="display:none;">
                    	<div class="form-group col-md-6">
						    <label>景区名称：<span id="scene-div-name"></span></label>
						</div>
						<div class="form-group col-md-6">
						    <label>景区地址：<span id="scene-div-addr"></span></label>
						</div>
						<div class="clearfix"></div><br>
                    </div>
                    <div id="ticket-ad-div">
                    	<div class="form-group col-md-12">
	                        <label>广告上架有效时间：</label>
	                        <input id="openTime" name="open_time" type="text" 
	                        	onClick="WdatePicker({dateFmt:'yyyy-MM-dd HH:mm:ss'})" class="form-control"/>
	                        <label> - </label>
	                        <input id="closeTime" name="close_time" type="text" 
	                        	onClick="WdatePicker({dateFmt:'yyyy-MM-dd HH:mm:ss'})" class="form-control"/>
	                    </div>
	                    <div class="clearfix"></div><br>
	                    <div class="form-group col-md-12">
	                        <label>广告显示排序号：</label>
	                        <input id="listOrder" name="listOrder" type="text" class="form-control"/>
	                    </div>
	                    <div class="clearfix"></div><br>
	                    <div class="form-group col-md-12">
	                    	<input type="hidden" id="imgPath">
	                    	<span class="btn btn-success fileinput-button">
						        <i class="glyphicon glyphicon-plus"></i>
						        <span>添加图片...</span>
						        <!-- The file input field used as target for the file upload widget -->
						        <input id="adImgFile" type="file" name="file" multiple>
						        <input type="hidden" id="imgPath">
						    </span>
	                    </div>
	                    <div class="clearfix"></div><br>
	                    <div class="form-group col-md-12">
	                    	<img id="adImg" width="160" height="120">
	                    </div>
	                    <div class="clearfix"></div><br>
	                    <a href="javascript:;" class="btn btn-default" onclick="saveAd();">保存</a>
	                    <a href="/ticket/ad/index.htm?dictionaryId=${param.dictionaryId }" class="btn btn-default">返回</a>
                    </div>
                </form>
            </div>
        </div>
    </div>
    <!--/span-->

</div><!--/row-->
</div>
</body>
</html>